import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx'
import { withRouter } from 'react-router-dom';
import { Tools, Avatar, ListView } from 'weaver-mobile';
import WrOperateLog from '../../../public/log'
import * as GoalBaseAPI from '../../../api/goal/goalBase';
import '../../../style/goal/goalOperateLog.less'
const getLabel = Tools.getLabel

@inject("goalOperateLogStore")
@withRouter
@observer
class GoalOperateLog extends React.Component{

    constructor(props) {
        super(props)
        const dataSource = new ListView.DataSource({
            rowHasChanged: (row1, row2) => row1 !== row2,
        })
        this.state = {
            ...props,
            dataSource
            // height: document.documentElement.clientHeight
        }
    }

    
    componentWillMount() {
        const { goalId } = this.state
        const { changeGoalId,changeDatas, changeLastcount, changeLastid,getGoalLog } = this.props.goalOperateLogStore;
        changeGoalId(goalId)
        getGoalLog()

    }

    handleLogRefresh = () => {
        const {  changeGoalId,changeDatas, changeLastcount, changeLastid,getGoalLog,logStore } = this.props.goalOperateLogStore
        // logStore.clearData()
        changeDatas([])
        changeLastcount(0)
        changeLastid("")

        getGoalLog(true)
    }

    //底部加载
    handleLogEndReached = () => {
        const { getGoalLog } = this.props.goalOperateLogStore
        getGoalLog()
    }



    render() {
        const { datas, logStore } = this.props.goalOperateLogStore
        return (
            <div className="workrelate-mobile-operate-log-wrapper">
                    <WrOperateLog
                        logStore={logStore}
                        handleRefresh={this.handleLogRefresh}
                        handleEndReached={this.handleLogEndReached}
                        customHeight = {window.innerHeight - 55}
                    ></WrOperateLog>
            </div>
        )
    }
}
export default GoalOperateLog; 